<template>
    <div class="headdiv">
        <div class="hdmain_left">
            <div class="hd_left">
                <span>AI爱招聘</span>
            </div>
            <div class="hd_center" v-show="showAction">
                <div class="hdc_div" :class="{select_div:active=='home'}" @click="setActive('/company/index')">
                    <span>我的首页</span>
                </div>
                <div class="hdc_div" :class="{select_div:active=='chat'}">
                    <span>沟通</span>
                </div>
                <div class="hdc_div" :class="{select_div:active=='sousuo'}" @click="setActive('/company/query')">
                    <span>检索简历</span>
                </div>
                <div class="hdc_div" :class="{select_div:active=='date'}" @click="setActive('/company/interviewCalendar')">
                    <span>面试日历</span>
                </div>
                <div class="hdc_div" :class="{select_div:active=='jianli'}" @click="setActive('/company/uploadResume')">
                    <span>上传简历</span>
                </div>
                <!-- <div class="hdc_div" :class="{select_div:active=='share'}">
                    <span>专业分享</span>
                </div> -->
            
                <div class="hdc_div" v-if="$root.userInfo.user.role=='admin'" :class="{select_div:active=='wode'}" @click="setActive('/company/systeminfo')">
                    <span>系统信息</span>
                </div>
            </div>
        </div>
       
        <el-dropdown v-show="showAction">
            <div class="hd_right" >
            
                <div class="hd_logo">
                    <img :src="'https://www.aizhaopin.pro/prod-api/sys/common/static/'+companyInfo.logo">
                </div>
                <div class="hd_name">
                    <span>{{companyInfo.name}}</span>
                </div>
                <div class="hd_icon">
                    <i class="iconfont icon-xiangxia"></i>
                </div>
            </div>
            <el-dropdown-menu slot="dropdown">
                <el-dropdown-item icon="el-icon-office-building" @click.native="toBaseInfo">基本资料</el-dropdown-item>
                <el-dropdown-item icon="el-icon-office-building" @click.native="toChangeUser">切换</el-dropdown-item>
                <el-dropdown-item icon="el-icon-switch-button" @click.native="loginOut">退出</el-dropdown-item>
                
            </el-dropdown-menu>
          
        </el-dropdown>


        
        <div class="muban_dialog"  v-show="showSelectUser">

        </div>


        <div class="box_slide_verify" v-show="showSelectUser" style="width: 400px;height: 350px;">
            <div class="bsv_head" style="border-bottom: 0px;">
                <span>请选择登录的角色</span>
                <i class="el-icon-circle-close" @click="showSelectUser = false"></i>
            </div>
            <div class="rolelist">
                <template v-for="item in roleList">
                    <div class="role_div" @click="selectRole(item)"
                        :class="{ select_role_div: item.id == selectForm.id }">
                        <div class="rd_left">
                            <div class="rd_img" v-if="item.logo">
                                <img v-if="item.logo"
                                    :src="'https://www.aizhaopin.pro/prod-api/sys/common/static/' + item.logo">

                            </div>
                            <div class="rd_img" v-else>
                                <img :src="userImg">
                            </div>
                            <div class="rd_name">
                                <span>{{ item.name }}</span>
                                <el-tag type="" effect="dark" size="small" v-if="item.type == 1"
                                    style="margin-left: 5px;">
                                    {{ item.typeDescription }}
                                </el-tag>
                                <el-tag type="warning" effect="dark" size="small" v-if="item.type == 2"
                                    style="margin-left: 5px;">
                                    {{ item.typeDescription }}
                                </el-tag>
                            </div>
                        </div>
                        <div class="rd_right">
                            <i class="el-icon-success" v-if="item.id == selectForm.id"></i>
                        </div>

                    </div>
                </template>


            </div>
            <div class="role_bottom">
                <div class="roled_btn" @click="sureLogin">
                    <span>确认</span>
                </div>
            </div>

        </div>
	
    </div>
  </template>
  
  <script>
   import homeapi from '@/api/api.js'
   import userImg from '@/assets/imgs/ai_logo.jpg'
   import until from '@/api/until.js'
  export default {
	name: 'postfooter',
    data(){
        return {
            companyInfo:{},
            showSelectUser: false,
            roleList: [],
            selectForm: {},
              userImg: userImg,
        }
    },
	props: {
		active: String,
        showAction:Boolean
	},
    mounted(){
        this.getCompanyInfo();
        this.getLoginUserList();
    },
	methods:{
		 //获取企业信息
        async getCompanyInfo(){
            let data=await homeapi.getCompanyInfo();
            if(data.code==200){
                this.companyInfo=data.result;
            }
        },
        setActive(type){
            window.open("/#"+type)
          
        },
        toBaseInfo(){
            window.open("/#/company/systeminfo")
           
        },
        loginOut(){
            console.log("....")
            until.setCookie("token","")
            this.$router.push("/login/loginnew")
           
        },
        async sureLogin() {
             let form=this.selectForm
            let data=await homeapi.confirmRole(form);
            if(data.code==200){

                until.setCookie("token",data.result)
                if(form.type==2){
                    this.$router.replace("/user/index")
                }
                // this.getUserInfo();
            
            }
        },
        selectRole(item){
            this.selectForm={
                id:item.id,
                type:item.type
            }
        },
        toChangeUser() {
            // this.getLoginUserList();
            if(this.roleList.length==1){
                this.$message.error("暂无其他角色");
            }
            if(this.roleList.length==2){
                this.roleList.map(res=>{
                    if(res.id!=this.companyInfo.id){
                        this.selectRole(res)
                        this.sureLogin()
                    }
                })
            }
            else{
                 this.showSelectUser=true;
            }
           
        },
         //获取登录的账号
        async getLoginUserList() {
            let data = await homeapi.getLoginUserList();
            if (data.code == 200) {
                if (data.result && data.result.length > 0) {
                    const roleList = data.result
                    this.roleList=roleList;
                    
                }
                else {
                    this.$message.error("请先注册")
                }

            }
        },
	}
  }
  </script>
<style scoped>
	.headdiv{
        width: 100%;
        height: 80px;
        background: #FFFFFF;
        border-radius: 0px 0px 0px 0px;
        padding: 0 16px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .hd_left{
        font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
        font-weight: 400;
        font-size: 24px;
        color: #F5792A;
        line-height: 31px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        font-weight: bold;
        width: 400px;
    }
    .hd_right{
        width: 400px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .hd_logo{
        width: 26px;
        height: 26px;
        background: #D8D8D8;
        border-radius: 50%;
    }
    .hd_logo img{
        width: 26px;
        height: 26px;
        border-radius: 50%;
    }
    .hd_name{
        font-size: 14px;
        color: #333333;
        line-height: 16px;
        margin-left: 8px;
    }
    .hd_icon .iconfont{
        font-size: 14px;
        color: #999999;
        margin-left: 8px;
    }
    .hd_center{
        display: flex;
        align-items: center;
        justify-content: center;

    }
    .hdc_div{
        font-size: 16px;
        color: #333333;
        margin-left: 32px;
        cursor: pointer;
    }
    .hdc_div:first-child{
        margin-left: 0px;
    }
    .select_div{
        color: #F5792A;
        font-weight: bold;
    }
    .hdmain_left{
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
</style>
  